﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>添加会员-WeAdmin Frame型后台管理系统-WeAdmin 1.0</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="../../../static/css/font.css">
    <link rel="stylesheet" href="../../../static/css/weadmin.css">
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
      <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
      <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body>
    <div class="weadmin-body">
        <form class="layui-form">
            <div class="layui-form-item">
                <label for="FTID" class="layui-form-label">
                    <span class="we-red"></span>文件类型
                </label>
                <div class="layui-input-inline">
                    <select id="FTID" name="FTID" class="valid"></select>
                </div>
                <label for="KKID" class="layui-form-label">
                    <span class="we-red"></span>知识点
                </label>
                <div class="layui-input-inline">
                    <select id="KKID" name="KKID" class="valid"></select>
                </div>
            </div>
            <div class="layui-form-item">
                <label for="TFUploadDeptID" class="layui-form-label">
                    <span class="we-red"></span>所属部门
                </label>
                <div class="layui-input-inline">
                    <select id="TFUploadDeptID" name="TFUploadDeptID" class="valid"></select>
                </div>
                <label for="TFFileLevel" class="layui-form-label">
                    <span class="we-red"></span>文件等级
                </label>
                <div class="layui-input-inline">
                    <select id="TFFileLevel" name="TFFileLevel" class="valid"></select>
                </div>
            </div>
            <div class="layui-form-item">
                <label for="TFFileKey" class="layui-form-label">
                    <span class="we-red"></span>文件关键字
                </label>
                <div class="layui-input-inline">
                    <input type="text" id="TFFileKey" name="TFFileKey" autocomplete="off" class="layui-input">
                </div> 
                <label for="TFReadTime" class="layui-form-label">
                    <span class="we-red"></span>阅读时间
                </label>
                <div class="layui-input-inline">
                    <input type="text" id="TFReadTime" name="TFReadTime" autocomplete="off" class="layui-input">
                </div>
                <label class="layui-form-label">秒
                </label>
            </div>
            <div class="layui-form-item">
                <label for="TFEndDateTime" class="layui-form-label">
                    <span class="we-red"></span>截止时间
                </label>
                <div class="layui-inline">
                    <input type="text" class="layui-input" name="TFEndDateTime" id="TFEndDateTime">
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-upload">
                    <button type="button" class="layui-btn layui-btn-normal" id="testList">选择文件</button>
                    <div class="layui-upload-list">
                        <table class="layui-table">
                            <thead>
                                <tr>
                                    <th>文件名</th>
                                    <th>大小</th>
                                    <th>状态</th>
                                    <th>操作</th>
                                </tr>
                            </thead>
                            <tbody id="demoList"></tbody>
                        </table>
                    </div>
                    <button type="button" class="layui-btn" id="testListAction">开始上传</button>
                </div>
            </div>
        </form>
    </div>
    <script src="../../../lib/layui/layui.js" charset="utf-8"></script>

    <script>
        layui.use(['form', 'jquery', 'layer', 'laydate', 'upload'], function () {
            var form = layui.form,
                $ = layui.jquery,
                //util = layui.util,
                //admin = layui.admin,
                layer = layui.layer,
                laydate = layui.laydate,
                upload = layui.upload;

            //执行一个laydate实例
            laydate.render({
                elem: '#TFEndDateTime',
                trigger: 'click'
            });
                $(function () {
                    //加载部门信息，文件类型，知识点

                    $.ajax({
                        url: ApiUrl + "TrainFileType/Sel",
                        type: 'post',
                        headers: {
                            "userid": JSON.parse(window.localStorage.authInfo).UserId,
                            "signtoken": JSON.parse(window.localStorage.authInfo).SignToken,
                        },
                        success: function (data) {
                            if (data.StatusCode == 200) {
                                $(data.Data).each(function (index, item) {
                                    $("#FTID").append("<option value='" + item.FTID + "'>" + item.FTName + "</option>");
                                });
                                form.render();
                            }
                            else if (data.StatusCode == 403) {
                                layer.alert(data.Info, function () {
                                    location.href = './login.html';
                                })
                            }
                            else {
                                layer.msg(data.Info);
                            }
                        }
                    });

                    form.render();
                    $.ajax({
                        url: ApiUrl + "TrainFileKnowledgeKey/SelList",
                        type: 'post',
                        headers: {
                            "userid": JSON.parse(window.localStorage.authInfo).UserId,
                            "signtoken": JSON.parse(window.localStorage.authInfo).SignToken,
                        },
                        success: function (data) {
                            if (data.StatusCode == 200) {
                                $(data.Data).each(function (index, item) {
                                    $("#KKID").append("<option value='" + item.KKID + "'>" + item.KKName + "</option>");
                                });
                                form.render();
                            }
                            else if (data.StatusCode == 403) {
                                layer.alert(data.Info, function () {
                                    location.href = './login.html';
                                })
                            }
                            else {
                                layer.msg(data.Info);
                            }
                        }
                    });
                    form.render();
                    $.ajax({
                        url: ApiUrl + "Dep/Sel",
                        type: 'post',
                        headers: {
                            "userid": JSON.parse(window.localStorage.authInfo).UserId,
                            "signtoken": JSON.parse(window.localStorage.authInfo).SignToken,
                        },
                        success: function (data) {
                            if (data.StatusCode == 200) {
                                $(data.Data).each(function (index, item) {
                                    $("#TFUploadDeptID").append("<option value='" + item.DepID + "'>" + item.DepName + "</option>");
                                });
                                form.render();
                            }
                            else if (data.StatusCode == 403) {
                                layer.alert(data.Info, function () {
                                    location.href = './login.html';
                                })
                            }
                            else {
                                layer.msg(data.Info);
                            }
                        }
                    });

                    form.render();
                    //加载重要等级
                    var nations = ["非常重要", "重要", "一般"];
                    var staff_nation = document.getElementById("TFFileLevel");
                    for (var i in nations) {
                        staff_nation.add(new Option(nations[i], nations[i]));
                    }
                    form.render();
                    
            });

            //多文件列表示例
            var demoListView = $('#demoList')
                , uploadListIns = upload.render({
                    elem: '#testList'
                    , url: ApiUrl + 'TrainFiles/FileUpload'
                    , headers: {
                        "userid": JSON.parse(window.localStorage.authInfo).UserId,
                        "signtoken": JSON.parse(window.localStorage.authInfo).SignToken,
                    }
                    , accept: 'file'
                    , exts:'jpg|png|gif|bmp|jpeg|doc|docx|pdf|mp4|avi|rm|mpg|flv|xls|xlsx|ppt|pptx'
                    , multiple: true
                    , auto: false
                    , bindAction: '#testListAction'
                    , choose: function (obj) {
                        var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列
                        //读取本地文件
                        obj.preview(function (index, file, result) {
                            var tr = $(['<tr id="upload-' + index + '">'
                                , '<td>' + file.name + '</td>'
                                , '<td>' + (file.size / 1014).toFixed(1) + 'kb</td>'
                                , '<td>等待上传</td>'
                                , '<td>'
                                , '<button class="layui-btn layui-btn-xs demo-reload layui-hide">重传</button>'
                                , '<button class="layui-btn layui-btn-xs layui-btn-danger demo-delete">删除</button>'
                                , '</td>'
                                , '</tr>'].join(''));

                            //单个重传
                            tr.find('.demo-reload').on('click', function () { 
                                obj.upload(index, file);
                            });

                            //删除
                            tr.find('.demo-delete').on('click', function () {
                                delete files[index]; //删除对应的文件
                                tr.remove();
                                uploadListIns.config.elem.next()[0].value = ''; //清空 input file 值，以免删除后出现同名文件不可选
                            });

                            demoListView.append(tr);
                        });
                    }
                    ,before: function (obj) {
                        this.data = {
                            FTID: $("#FTID  option:selected").val(),
                            KKID: $("#KKID  option:selected").val(),
                            TFUploadDeptID: $("#TFUploadDeptID  option:selected").val(),
                            TFFileLevel: $("#TFFileLevel").val(),
                            TFFileKey: $("#TFFileKey").val(),
                            TFReadTime: $("#TFReadTime").val(),
                            TFEndDateTime: $("#TFEndDateTime").val()
                        }//携带额外的数据
                        //var index = layer.load(); //开始上传之后打开load层
                    }
                    , done: function (res, index, upload) {
                        if (res.code == 0) { //上传成功
                            var tr = demoListView.find('tr#upload-' + index)
                                , tds = tr.children();
                            tds.eq(2).html('<span style="color: #5FB878;">上传成功</span>');
                            tds.eq(3).html(''); //清空操作
                            return delete this.files[index]; //删除文件队列已经上传成功的文件
                        }
                        if (res.code == 601) { //上传成功
                            var tr = demoListView.find('tr#upload-' + index)
                                , tds = tr.children();
                            tds.eq(2).html('<span style="color: #5FB878;">文件重复</span>');
                            tds.eq(3).html(''); //清空操作
                            return delete this.files[index]; //删除文件队列已经上传成功的文件
                        }
                        this.error(index, upload);
                    }
                    , error: function (index, upload) {
                        var tr = demoListView.find('tr#upload-' + index)
                            , tds = tr.children();
                        tds.eq(2).html('<span style="color: #FF5722;">上传失败</span>');
                        tds.eq(3).find('.demo-reload').removeClass('layui-hide'); //显示重传
                    }
                });

            
        });
    </script>
</body>
</html>